<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
    <meta name="format-detection" content="telephone=no">
    <link rel="apple-touch-icon-precomposed" sizes="57x57" href="${request.contextPath}/resources/image/desktop_logo-57.png">
    <link rel="apple-touch-icon-precomposed" sizes="72x72" href="${request.contextPath}/resources/image/desktop_logo-72.png">
    <link rel="apple-touch-icon-precomposed" sizes="114x114" href="${request.contextPath}/resources/image/desktop_logo-114.png">
    <title>100%喜帖</title>
    <link rel="stylesheet" href="${request.contextPath}/resources/css/bootstrap.min.css">
    <link rel="stylesheet" href="${request.contextPath}/resources/css/style.css">
    <style>
        body:before {
            content: ' ';
            position: fixed;
            z-index: -1;
            top: 0;
            right: 0;
            bottom: 0;
            left: 0;
            background: url(${request.contextPath}/resources/image/template_bg.jpg) center 0 no-repeat;
            background-size: cover;
        }
    </style>
	
</head>
<body style="background-image: url(${request.contextPath}/resources/image/template_bg.jpg); background-attachment: fixed;">
<!-- Modal -->
<div class="modal fade" id="focusesUs" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog modal-sm" role="document" style="margin: 2.5rem;">
        <div class="modal-content">
            <div class="modal-header" style="border: none; padding-bottom: 0;">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="col-xs-12">
                        <div align="center">
                            <img src="${request.contextPath}/resources/image/2weima.png">
                        </div>
					    
                        <h3 style="text-align: center; color: #ff3261; margin-top: 1rem;">长按关注我们</h3>
                        <ul class="list-unstyled">
                            <li style="text-align: center; color: #ff3261;">制作属于自己的结婚请柬</li>
                            <li style="text-align: center; color: #ff3261; margin-top: 10px;">公众号:百分百喜帖</li>
                            <li style="text-align: center; color: #ff3261;">www.100hunqing.cn</li>
                        </ul>
                        <p class="text-center"><img src="${request.contextPath}/resources/image/login_small.png"></p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="container-fluid">
    <div class="row">
        <div id="template-wrapper">
            <div class="template_top">
                <div class="template_header">
	                <img src="${request.contextPath}/resources/image/template_top.png">
				    <#if loginFlag = true>
	                    <!--<span class="sidebar_switch">${userName}</span>-->
					</#if>
                </div>
                <div class="template_title">
                    <h4>模板 OUR CARDS</h4>
                </div>
            </div>
            <div class="template_main">
                <div class="row">
                    <div class="col-xs-6 col-xs-left">
	                    <div id="first-template" class="template_box">
						    <#if topTemplate1 != null>
							    <div class="template_con">
								    <a href="${request.contextPath}/templates/${topTemplate1.templateId}/preview/v12">
							            <img src="${request.contextPath}/resources/image/${topTemplate1.preview}">
									</a>
								</div>
		                        <div class="template_foot">
		                            <div class="template_name">
		                                <div class="title">${topTemplate1.name}</div>
		                                <div class="title_small">${topTemplate1.subname}</div>
		                            </div>
		                            <!-- <div class="template_heart">
		                                <a href="${request.contextPath}/templates/${topTemplate1.templateId}/vote"><img src="${request.contextPath}/resources/image/heart_5.png"></a>
		                                <small style="color: #ff3261;">${topTemplate1.polls}</small>
		                            </div> -->
		                        </div>
							<#else>
		                        <div class="template_con">
		                            <img src="${request.contextPath}/resources/image/img_002.png">
		                        </div>
							</#if>
	                    </div>
	                </div>
                    <div class="col-xs-6 col-xs-right">
	                    <div id="second-template" class="template_box">
						    <#if topTemplate2 != null>
							    <div class="template_con">
								    <a href="${request.contextPath}/templates/${topTemplate2.templateId}/preview/v12">
							            <img src="${request.contextPath}/resources/image/${topTemplate2.preview}">
									</a>
		                        </div>
								<div class="template_foot">
		                            <div class="template_name">
		                                <div class="title">${topTemplate2.name}</div>
		                                <div class="title_small">${topTemplate2.subname}</div>
		                            </div>
		                            <!-- <div class="template_heart">
		                                <a href="${request.contextPath}/templates/${topTemplate2.templateId}/vote"><img src="${request.contextPath}/resources/image/heart_5.png"></a>
		                                <small style="color: #ff3261;">${topTemplate2.polls}</small>
		                            </div> -->
		                        </div>
							<#else>
		                        <div class="template_con">
		                            <img src="${request.contextPath}/resources/image/img_001.png">
		                        </div>
							</#if>
	                    </div>
	                </div>
                </div>
	            <div class="row">
                    <div class="col-xs-6 col-xs-left">
	                    <div class="template_box">
						    <#if topTemplate3 != null>
							    <div class="template_con">
								    <a href="${request.contextPath}/templates/${topTemplate3.templateId}/preview/v12">
							            <img src="${request.contextPath}/resources/image/${topTemplate3.preview}">
									</a>
								</div>
		                        <div class="template_foot">
		                            <div class="template_name">
		                                <div class="title">${topTemplate3.name}</div>
		                                <div class="title_small">${topTemplate3.subname}</div>
		                            </div>
		                            <!-- <div class="template_heart">
		                                <a href="${request.contextPath}/templates/${topTemplate3.templateId}/vote"><img src="${request.contextPath}/resources/image/heart_5.png"></a>
		                                <small style="color: #ff3261;">${topTemplate3.polls}</small>
		                            </div> -->
		                        </div>
							<#else>
		                        <div class="template_con">
		                            <img src="${request.contextPath}/resources/image/img_002.png">
		                        </div>
							</#if>
	                    </div>
	                </div>
                    <div class="col-xs-6 col-xs-right">
	                    <div class="template_box">
						    <#if topTemplate4 != null>
							    <div class="template_con">
							        <a href="${request.contextPath}/templates/${topTemplate4.templateId}/preview/v3">
									    <img src="${request.contextPath}/resources/image/${topTemplate4.preview}">
									</a>
		                        </div>
								<div class="template_foot">
		                            <div class="template_name">
		                                <div class="title">${topTemplate4.name}</div>
		                                <div class="title_small">${topTemplate4.subname}</div>
		                            </div>
		                            <!--<div class="template_heart">
		                                <a href="${request.contextPath}/templates/${topTemplate4.templateId}/vote"><img src="${request.contextPath}/resources/image/heart_5.png"></a>
		                                <small style="color: #ff3261;"></small>
		                            </div>-->
		                        </div>
							<#else>
		                        <div class="template_con">
		                            <img src="${request.contextPath}/resources/image/img_003.png">
		                        </div>
							</#if>
	                    </div>
	                </div>
	            </div>
                <div class="row">
                    <div class="col-xs-6 col-xs-left">
                        <div class="template_box">
						<#if topTemplate3 != null>
                            <div class="template_con">
                                <a href="${request.contextPath}/templates/${topTemplate5.templateId}/preview/v12">
                                    <img src="${request.contextPath}/resources/image/${topTemplate5.preview}">
                                </a>
                            </div>
                            <div class="template_foot">
                                <div class="template_name">
                                    <div class="title">${topTemplate5.name}</div>
                                    <div class="title_small">${topTemplate5.subname}</div>
                                </div>
                                <!-- <div class="template_heart">
		                                <a href="${request.contextPath}/templates/${topTemplate5.templateId}/vote"><img src="${request.contextPath}/resources/image/heart_5.png"></a>
		                                <small style="color: #ff3261;">${topTemplate5.polls}</small>
		                            </div> -->
                            </div>
						<#else>
                            <div class="template_con">
                                <img src="${request.contextPath}/resources/image/img_002.png">
                            </div>
						</#if>
                        </div>
                    </div>
                    <div class="col-xs-6 col-xs-right">
                        <div class="template_box">
						<#if topTemplate4 != null>
                            <div class="template_con">
                                <a href="${request.contextPath}/templates/${topTemplate6.templateId}/preview/v3">
                                    <img src="${request.contextPath}/resources/image/${topTemplate6.preview}">
                                </a>
                            </div>
                            <div class="template_foot">
                                <div class="template_name">
                                    <div class="title">${topTemplate6.name}</div>
                                    <div class="title_small">${topTemplate6.subname}</div>
                                </div>
                                <!--<div class="template_heart">
		                                <a href="${request.contextPath}/templates/${topTemplate6.templateId}/vote"><img src="${request.contextPath}/resources/image/heart_5.png"></a>
		                                <small style="color: #ff3261;"></small>
		                            </div>-->
                            </div>
						<#else>
                            <div class="template_con">
                                <img src="${request.contextPath}/resources/image/img_003.png">
                            </div>
						</#if>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-xs-6 col-xs-left">
                        <div class="template_box">
						<#if topTemplate3 != null>
                            <div class="template_con">
                                <a href="${request.contextPath}/templates/${topTemplate7.templateId}/preview/v12">
                                    <img src="${request.contextPath}/resources/image/${topTemplate7.preview}">
                                </a>
                            </div>
                            <div class="template_foot">
                                <div class="template_name">
                                    <div class="title">${topTemplate7.name}</div>
                                    <div class="title_small">${topTemplate7.subname}</div>
                                </div>
                                <!-- <div class="template_heart">
		                                <a href="${request.contextPath}/templates/${topTemplate7.templateId}/vote"><img src="${request.contextPath}/resources/image/heart_5.png"></a>
		                                <small style="color: #ff3261;">${topTemplate7.polls}</small>
		                            </div> -->
                            </div>
						<#else>
                            <div class="template_con">
                                <img src="${request.contextPath}/resources/image/img_002.png">
                            </div>
						</#if>
                        </div>
                    </div>
                    <div class="col-xs-6 col-xs-right">
                        <div class="template_box">
						<#if topTemplate4 != null>
                            <div class="template_con">
                                <a href="${request.contextPath}/templates/${topTemplate8.templateId}/preview/v3">
                                    <img src="${request.contextPath}/resources/image/${topTemplate8.preview}">
                                </a>
                            </div>
                            <div class="template_foot">
                                <div class="template_name">
                                    <div class="title">${topTemplate8.name}</div>
                                    <div class="title_small">${topTemplate8.subname}</div>
                                </div>
                                <!--<div class="template_heart">
		                                <a href="${request.contextPath}/templates/${topTemplate8.templateId}/vote"><img src="${request.contextPath}/resources/image/heart_5.png"></a>
		                                <small style="color: #ff3261;"></small>
		                            </div>-->
                            </div>
						<#else>
                            <div class="template_con">
                                <img src="${request.contextPath}/resources/image/img_003.png">
                            </div>
						</#if>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-xs-6 col-xs-left">
                        <div class="template_box">
						<#if topTemplate3 != null>
                            <div class="template_con">
                                <a href="${request.contextPath}/templates/${topTemplate9.templateId}/preview/v12">
                                    <img src="${request.contextPath}/resources/image/${topTemplate9.preview}">
                                </a>
                            </div>
                            <div class="template_foot">
                                <div class="template_name">
                                    <div class="title">${topTemplate9.name}</div>
                                    <div class="title_small">${topTemplate9.subname}</div>
                                </div>
                                <!-- <div class="template_heart">
		                                <a href="${request.contextPath}/templates/${topTemplate9.templateId}/vote"><img src="${request.contextPath}/resources/image/heart_5.png"></a>
		                                <small style="color: #ff3261;">${topTemplate9.polls}</small>
		                            </div> -->
                            </div>
						<#else>
                            <div class="template_con">
                                <img src="${request.contextPath}/resources/image/img_002.png">
                            </div>
						</#if>
                        </div>
                    </div>
                    <div class="col-xs-6 col-xs-right">
                        <div class="template_box">
						<#if topTemplate4 != null>
                            <div class="template_con">
                                <a href="${request.contextPath}/templates/${topTemplate10.templateId}/preview/v3">
                                    <img src="${request.contextPath}/resources/image/${topTemplate10.preview}">
                                </a>
                            </div>
                            <div class="template_foot">
                                <div class="template_name">
                                    <div class="title">${topTemplate10.name}</div>
                                    <div class="title_small">${topTemplate10.subname}</div>
                                </div>
                                <!--<div class="template_heart">
		                                <a href="${request.contextPath}/templates/${topTemplate10.templateId}/vote"><img src="${request.contextPath}/resources/image/heart_5.png"></a>
		                                <small style="color: #ff3261;"></small>
		                            </div>-->
                            </div>
						<#else>
                            <div class="template_con">
                                <img src="${request.contextPath}/resources/image/img_003.png">
                            </div>
						</#if>
                        </div>
                    </div>
                </div>
            </div>
            
        </div>
		
        <div class="sidebar">
            <div class="col-xs-4">
			    <#if loginFlag = false>
                <a href="${request.contextPath}/login">
                    <img src="${request.contextPath}/resources/image/btn_login.png">
                </a>
			    <#else>
				    <img src="${request.contextPath}/resources/image/btn_login_gray.png">
				</#if>
            </div>
            <div class="col-xs-4">
			    <a href="${request.contextPath}/cards/v12">
                    <img src="${request.contextPath}/resources/image/btn_mycard.png">
				</a>
            </div>
            <div class="col-xs-4">
                <img class="sidebar_weixin" src="${request.contextPath}/resources/image/btn_gzwm.png">
            </div>
        </div>
		
    </div>
</div>
<script src="${request.contextPath}/resources/js/jquery-2.1.4.min.js"></script>
<script src="${request.contextPath}/resources/js/bootstrap.min.js"></script>
<script>
    $(document).ready(
        function(){
            $('.sidebar_weixin').on('click',function(){
                $('#focusesUs').modal();
            });
            setTimeout(function() {
                var h = $('#first-template').height();
                console.log(h);
                $('#second-template').height(h);
            },300);
        }
    );
</script>
</body>
</html>
